<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        .menu {
            /* 去掉列表前面的小圆点（数字） */
            list-style: none;
            display: flex;
        }

        .menu>li {
            width: 100px;
        }
    </style>
</head>

<body>
    <ul class="menu">
        <li>首页</li>
        <li>所有商品</li>
        <li>装饰摆件</li>
    </ul>
    <!-- 无序列表 -->
    <ul>
        <li>列表第一项</li>
        <li>列表第二项</li>
        <li>列表第三项</li>
    </ul>
    <!-- 有序列表 -->
    <ol>
        <li>列表第一项</li>
        <li>列表第二项</li>
        <li>列表第三项</li>
        <li>列表第四项</li>
    </ol>

    <!-- 自定义列表 -->
    <dl>
        <dt>列表标题一</dt>
        <dd>列表第一条内容</dd>
        <dd>列表第二条内容</dd>
    </dl>

    <dl>
        <dt>列表标题二</dt>
        <dd>列表第一条内容</dd>
        <dd>列表第二条内容</dd>
    </dl>


</body>

</html>